<template>
  <div class="tiktokVideo" style="padding: 10px">
    <dt-search ref="search" :label-width="90" :xlBtn='6'>
      <Button type="primary" @click="exportData">导出</Button>
    </dt-search>
    <div class="tips"><span>
        <Icon type="ios-alert" color="#F2863A" size="24" /> 提示：每周一中午12点更新账号数据</span>
    </div>
    <dt-grid ref="table" :page='page' :onFetch='onFetch' />
  </div>
</template>

<script>
  import Column from './components/tiktokAccountColumn'
  import SearchOpt from './components/tiktokAccountSearch'
  import tiktokMgr from "@/biz/tiktok/tiktok";
  export default {
    data() {
      return {
        option: {
          orgIds: [],
        },
        page: {
          total: 0,
        },
      }
    },
    created() {},
    mounted() {
      this.$refs.table.init(this, new Column(this))
      this.$refs.search.init(this.$refs.table, new SearchOpt())
      this.$refs.table.fetch()
    },
    methods: {
      exportData() {
        // params.dto.buildingId = this.$dt.buildInfo().housesId
        // publicCustomerMgr.downloadWechatClue(this.option)
        this.option.rows = 1000000000
        this.option.page = 1
        this.option.current = 1
        tiktokMgr.exportLog2(this.option)
      },
      onFetch(data) {
        this.option = {
          ...data
        }
        if (!this.option.orgIds) {
          delete this.option.orgIds
        }
        if (this.option.orgIds && this.option.orgIds.length < 0) {
          delete this.option.orgIds
        }
        return tiktokMgr.tiktokAccountStatistics2(this.option).then(res => {
          this.page.total = res.total
          return res.list
        })
      },
      getDetail(val) {
        this.$router.push({
          path: '/reportCenter/marketingStatistics/tiktokAccountDetails',
          query: {
            userId: val.userId,
            userName: val.userName,
            authTimeStart: this.option.authTimeStart,
            authTimeEnd: this.option.authTimeEnd

          },
        })
      },
    },
  };
</script>

<style lang="scss" scoped>
  .tiktokVideo {
    .tips {
      padding-bottom: 20px;
      padding-left: 20px;

      span {
        display: inline-block;
        background: #FFF9ED;
        padding: 6px 20px;
        // font-size: 12px;
        color: #666;

      }

    }
  }

  .channel-audit {
    padding: 20px;
  }

  .searchBox {
    padding: 20px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
</style>